<template>
	<view>
		<view class="page">
			<comp-common v-bind="{data:data}" @getUserInfo="getUserInfo" @myLogin="myLogin" @getPhoneNumber="getPhoneNumber" @hideGetCoupon="hideGetCoupon" @closeCouponBox="closeCouponBox" @navigatorClick="navigatorClick"></comp-common>
			<comp-header v-bind="{data:data}" @relevanceError="relevanceError" @relevanceSuccess="relevanceSuccess"></comp-header>
			<view class="body after-navber">
				<view class="info">
            <view class="info-title flex-row" v-if="data.share_setting.level==3">
                <navigator class="flex-x-center width" openType="redirect" url="/pages/share-team/share-team?status=1">
                    <view :class="['info-text', data.status==1?'active':'']">{{data.share_setting.first_name||'一级'}}({{data.first_count}})</view>
                </navigator>
                <navigator class="flex-x-center width" openType="redirect" url="/pages/share-team/share-team?status=2">
                    <view :class="['info-text', data.status==2?'active':'']">{{data.share_setting.second_name||'二级'}}({{data.second_count}})</view>
                </navigator>
                <navigator class="flex-x-center width" openType="redirect" url="/pages/share-team/share-team?status=3">
                    <view :class="['info-text', data.status==3?'active':'']">{{data.share_setting.third_name||'三级'}}({{data.third_count}})</view>
                </navigator>
            </view>
            <view class="info-title flex-row" v-else-if="data.share_setting.level==2">
                <navigator class="flex-x-center width-50" openType="redirect" url="/pages/share-team/share-team?status=1">
                    <view :class="['info-text', data.status==1?'active':'']">{{data.share_setting.first_name||'一级'}}({{data.first_count}})</view>
                </navigator>
                <navigator class="flex-x-center width-50" openType="redirect" url="/pages/share-team/share-team?status=2">
                    <view :class="['info-text', data.status==2?'active':'']">{{data.share_setting.second_name||'二级'}}({{data.second_count}})</view>
                </navigator>
            </view>
            <block v-else></block>
            <view class="info-content" :style="data.share_setting.level==1?'padding-top:0':''">
                <view class="info-label" v-for="(item,index) in data.list" :key="item.id">
                    <view class="info-up flex-y-center flex-row">
                        <view class="info-img flex-grow-0">
                            <image class="img" :src="item.avatar_url"></image>
                        </view>
                        <view class="info-text flex-grow-1">
                            <view class="info-name flex-row" style="justify-content:space-between;">
                                <view class="flex-grow-0 flex-y-center text-more" style="width:300upx;display:block">{{item.nickname}}</view>
                                <view class="flex-grow-0 flex-y-center fs-sm">推广{{item.child_count}}人</view>
                            </view>
                            <view class="info-time">注册时间：{{item.time}}</view>
                        </view>
                    </view>
                    <view class="info-down flex-y-center">
                        <view class="info-left">消费{{item.price}}元</view>
                        <view class="info-right">
                            <view class="info-order">{{item.count}}个订单</view>
                        </view>
                    </view>
                </view>
            </view>
            <view class="info-footer flex-row" v-if="data.no_more">
                <view class="info-before">
                    <view class="info-border"></view>
                </view>
                <view class="info-t">没有更多了</view>
                <view class="info-after">
                    <view class="info-border"></view>
                </view>
            </view>
        </view>
			</view>
			<comp-footer v-bind="{data:data}"></comp-footer>
		</view>
	</view>
</template>

<script>var myVue = {};
	var t = !1, a = !1, e = 2;
	export default {
		data() {
			return {
				data: {
        status: 1,
        first_count: 0,
        second_count: 0,
        third_count: 0,
        list: Array,
        no_more: !1
    },
			};
		},
		onLoad: function(s) {myVue = this;
        myVue.getApp.page.onLoad(this, s);
        var o = this, i = myVue.getApp.core.getStorageSync(myVue.getApp.const.SHARE_SETTING);
        o.setData({
            share_setting: i
        }), a = !1, t = !1, e = 2, o.GetList(s.status || 1);
    },
    GetList: function(e) {
        var s = this;
        a || (a = !0, s.setData({
            status: parseInt(e || 1)
        }), myVue.getApp.core.showLoading({
            title: "正在加载",
            mask: !0
        }), myVue.getApp.request({
            url: myVue.getApp.api.share.get_team,
            data: {
                status: s.data.status,
                page: 1
            },
            success: function(a) {
                s.setData({
                    first_count: a.data.first,
                    second_count: a.data.second,
                    third_count: a.data.third,
                    list: a.data.list
                }), 0 == a.data.list.length && (t = !0, s.setData({
                    no_more: !0
                }));
            },
            complete: function() {
                s.getApp.core.hideLoading(), a = !1;
            }
        }));
    },
    onReachBottom: function() {
        t || this.loadData();
    },
		methods: {
			loadData: function() {
        if (!a) {
            a = !0;
            var s = this;
            myVue.getApp.core.showLoading({
                title: "正在加载",
                mask: !0
            }), myVue.getApp.request({
                url: myVue.getApp.api.share.get_team,
                data: {
                    status: s.data.status,
                    page: e
                },
                success: function(a) {
                    s.setData({
                        first_count: a.data.first,
                        second_count: a.data.second,
                        third_count: a.data.third,
                        list: s.data.list.concat(a.data.list)
                    }), 0 == a.data.list.length && (t = !0, s.setData({
                        no_more: !0
                    }));
                },
                complete: function() {
                    s.getApp.core.hideLoading(), a = !1, e++;
                }
            });
        }
    }
		},
	}
</script>

<style scoped>
.info {
    width: 100%;
}

.width {
    width: 33.33333333%;
    text-align: center;
}

.width-50 {
    width: 50%;
    text-align: center;
}

.info .info-title .info-text.active {
    color: #ff4544;
    border-bottom: 4upx #ff4544 solid;
}

.info .info-title {
    width: 100%;
    height: 100upx;
    padding: 0 24upx;
    border-bottom: 1upx #e3e3e3 solid;
    font-size: 13pt;
    background-color: #fff;
    line-height: 80upx;
    position: fixed;
    top: var(--window-top);
    left: 0;
}

.info-title .info-text {
    height: 100upx;
    line-height: 100upx;
}

.info .info-content {
    width: 100%;
    margin-bottom: 12upx;
    padding-top: 100upx;
}

.info .info-content .info-label {
    width: 100%;
    background-color: #fff;
    padding: 0 24upx;
    height: 240upx;
    margin-bottom: 20upx;
}

.info-label .info-up {
    width: 100%;
    height: 160upx;
    border-bottom: 1upx #eeeeee solid;
}

.info-label .info-down {
    width: 100%;
    height: 80upx;
    color: #666;
}

.info-label .info-up .info-img {
    margin-right: 24upx;
}

.info-up .info-img .img {
    width: 100upx;
    height: 100upx;
}

.info-up .info-text .info-name {
    color: #353535;
    margin-bottom: 16upx;
}

.info-up .info-text .info-time {
    font-size: 9pt;
    color: #666666;
}

.info-down .info-left {
    width: 50%;
    height: 80upx;
    line-height: 80upx;
}

.info-down .info-right {
    float: right;
    height: 80upx;
    width: 50%;
    line-height: 80upx;
    text-align: right;
}

.info .info-footer {
    color: #bbb;
    text-align: center;
    width: 100%;
    padding: 0 100upx;
    height: 60upx;
    line-height: 60upx;
}

.info .info-footer .info-t {
    height: 60upx;
    margin: 0 20upx;
}

.info .info-footer .info-before {
    width: 168upx;
    height: 60upx;
}

.info .info-footer .info-after {
    width: 168upx;
    height: 60upx;
}

.info .info-footer .info-border {
    border-bottom: 1upx #e3e3e3 solid;
    padding-bottom: 30upx;
}
</style>
